<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>New tab</title>
    <link rel="stylesheet" href="styles/newtab.css">
</head>
<body>
    <div class="bubble-bg" id="bubbleBg"></div>
    <div class="container">
        <div class="logo">
            <img src="assets/images/logo.png" alt="Search Logo">
        </div>
        <div class="search-box">
            <select id="engineSelect">
                <option value="bing">Bing</option>
                <option value="google">Google</option>
                <option value="baidu">Baidu</option>
            </select>
            <input type="text" id="searchInput" placeholder="Search the web">
        </div>
        <!-- 收藏网站区域 -->
        <div class="favorites" id="favorites">
            <!-- 默认收藏（可取消注释或保留供参考） -->
            <!--
            <a href="https://www.google.com" class="favorite" target="_blank">
                <div class="icon">G</div>
                <div class="name">Google</div>
            </a>
            <a href="https://www.baidu.com" class="favorite" target="_blank">
                <div class="icon">B</div>
                <div class="name">Baidu</div>
            </a>
            <a href="https://www.github.com" class="favorite" target="_blank">
                <div class="icon">G</div>
                <div class="name">Github</div>
            </a>
            -->
            <!-- 新增“+”按钮 -->
            <a href="#" class="favorite add-favorite" id="addFavoriteBtn">
                <div class="icon">+</div>
                <div class="name">添加</div>
            </a>
        </div>
    </div>
    <footer class="footer">
        <div class="time" id="currentTime"></div>
        <div class="quote" id="quote">加载中....</div>
        <div class="copyright">Copyright © 2025 Your Name</div>
    </footer>

    <!-- 添加收藏弹出层 -->
    <div id="favoriteModal" class="modal">
        <div class="modal-content">
            <h3>添加收藏网站</h3>
            <label for="favName">名称:</label>
            <input type="text" id="favName" placeholder="网站名称">
            <label for="favUrl">网址:</label>
            <input type="text" id="favUrl" placeholder="https://">
            <div class="modal-buttons">
                <button id="saveFavButton">保存</button>
                <button id="cancelFavButton">取消</button>
            </div>
        </div>
    </div>

    <!-- 编辑收藏弹出层 -->
    <div id="favoriteEditModal" class="modal">
        <div class="modal-content">
            <h3>编辑收藏网站</h3>
            <label for="editFavName">名称:</label>
            <input type="text" id="editFavName" placeholder="网站名称">
            <label for="editFavUrl">网址:</label>
            <input type="text" id="editFavUrl" placeholder="https://">
            <div class="modal-buttons">
                <button id="updateFavButton">更新</button>
                <button id="deleteFavButton">删除</button>
                <button id="cancelEditFavButton">取消</button>
            </div>
        </div>
    </div>
    <script src="newtab.js"></script>
</body>
</html>